<template>
  <a-tooltip>
    <template #title>prompt text</template>
    Tooltip will show when mouse enter.
  </a-tooltip>
  <div :style="wrapStyles">
    <a-tooltip
      :arrow="false"
      placement="right"
      title="Prompt Text"
      :auto-adjust-overflow="false"
    >
      <a-button>Adjust automatically / 自动调整</a-button>
    </a-tooltip>
  </div>
</template>

<script>
export default {
  name: '',
  components: {},
  data() {
    return {
      wrapStyles: {
        overflow: 'hidden',
        position: 'relative',
        padding: '24px',
        border: '1px solid #e9e9e9',
        width: '100px'
      }
    }
  },
  created() { },
  mounted() { },
  methods: {
    getPopupContainer(trigger) {
      console.log(trigger.parentElement);
      return trigger.parentElement;
    },
  },
  computed: {}
}
</script>
<style scoped lang='scss'>
</style>
